export function createAlert() {
    // this.alertContainer => 将数据存储到实例化对象上(后续可以继续使用)
    this.alertContainer = document.createElement("div");
    this.alertContainer.classList.add("alert","hide");
    

    this.alertTitle = document.createElement("div");
    this.alertTitle.classList.add("alert-title");
    this.alertTitle.textContent = "提示:";
    this.alertContainer.appendChild(this.alertTitle);


    this.alertContent = document.createElement("div");
    this.alertContent.classList.add("alert-content");
    this.alertContent.textContent = "";
    this.alertContainer.appendChild(this.alertContent);

    // var => 局部变量 -> 仅当前函数优先
    var alertFooter = document.createElement("div");
    alertFooter.classList.add("alert-footer");

    this.alertConfirm = document.createElement("button");
    this.alertConfirm.classList.add("alert-confirm");
    this.alertConfirm.textContent = "确定";
    alertFooter.appendChild(this.alertConfirm);

    this.alertContainer.appendChild(alertFooter);

    document.body.appendChild(this.alertContainer);
}


createAlert.prototype.init = function (options = {}) { // options = {title,content,confirmBtn:"",offset:[],success,cancel}
    // this -> 调用此方法的实例化对象
    this.alertContainer.classList.remove("hide");
    this.setOptions(options);
    this.bindEvent();
}

createAlert.prototype.setOptions = function(options){
    // 配置alert框的内容
    var { title = "提示", content = "", confirmBtn = "确认" } = options;
    this.alertTitle.textContent = title;
    this.alertContent.textContent = content;
    this.alertConfirm.textContent = confirmBtn;
}

createAlert.prototype.bindEvent = function(){
    var _this = this;
    this.alertConfirm.onclick = function(){
        _this.alertContainer.classList.add("hide");
    }
}